
    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
        <%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
        <%@ taglib uri="http://java.sun.com/jstl/fmt_rt" prefix="fmt"%>
        <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
            <%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"
            +request.getServerName()+":"
            +request.getServerPort()+path+"/";
%>

        <base href="<%=basePath%>">
        <%--<html>
        <head>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">

        <title>用户管理</title>
        </head>

            <style>
                .oneTable{width: 300px;height: auto;float: left;}
                  .twoTable{width: 600px;height: auto;float: left;margin-left: 40px}
            .tab_container{width: 1000px;height: auto;float: left;margin-top: 100px;margin-left: 160px}
            </style>

        <body>

            <div class="tab_container">


            <table class="oneTable">
                <thead>
                <tr>
                <th>用户工号</th>
                <th>用户名称</th>
                </tr>
                </thead>
            <tbody>
            <c:forEach items="${user_list_menus}" var="u">
                <tr>
                <td>${u.userid}</td>
                <td>${u.username}</td>
                </tr>
            </c:forEach>
            </tbody>
            </table>


            <table class="twoTable">
                <thead>
                <tr>
                <th>权限编号</th>
                <th>权限名称</th>
                <th>访问地址</th>
                <th>权限水平</th>
                </tr>
                </thead>
            <tbody>

                <c:forEach items="${menus}" var="m">
                    <tr>
                        <td>${m.menuid}</td>
                        <td>${m.menuname}</td>
                        <td>${m.url}</td>
                        <td>${m.level}</td>
                    </tr>
                </c:forEach>

            </tbody>
            </table>


            </div>
        </body>
        </html>--%>




        <!DOCTYPE html>
        <html>
        <head>
        <title>Flatty - Flat administration template</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport' />

        <!--[if lt IE 9]>
        <script src='assets/javascripts/html5shiv.js' type='text/javascript'></script>
        <![endif]-->
        <link href='assets/stylesheets/bootstrap/bootstrap.css' media='all' rel='stylesheet' type='text/css' />
        <link href='assets/stylesheets/bootstrap/bootstrap-responsive.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / jquery ui -->
        <link href='assets/stylesheets/jquery_ui/jquery-ui-1.10.0.custom.css' media='all' rel='stylesheet' type='text/css' />
        <link href='assets/stylesheets/jquery_ui/jquery.ui.1.10.0.ie.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / switch buttons -->
        <link href='assets/stylesheets/plugins/bootstrap_switch/bootstrap-switch.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / xeditable -->
        <link href='assets/stylesheets/plugins/xeditable/bootstrap-editable.css' media='all' rel='stylesheet' type='text/css' />
        <link href='assets/stylesheets/plugins/common/bootstrap-wysihtml5.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / wysihtml5 (wysywig) -->
        <link href='assets/stylesheets/plugins/common/bootstrap-wysihtml5.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / jquery file upload -->
        <link href='assets/stylesheets/plugins/jquery_fileupload/jquery.fileupload-ui.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / full calendar -->
        <link href='assets/stylesheets/plugins/fullcalendar/fullcalendar.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / select2 -->
        <link href='assets/stylesheets/plugins/select2/select2.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / mention -->
        <link href='assets/stylesheets/plugins/mention/mention.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / tabdrop (responsive tabs) -->
        <link href='assets/stylesheets/plugins/tabdrop/tabdrop.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / jgrowl notifications -->
        <link href='assets/stylesheets/plugins/jgrowl/jquery.jgrowl.min.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / datatables -->
        <link href='assets/stylesheets/plugins/datatables/bootstrap-datatable.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / dynatrees (file trees) -->
        <link href='assets/stylesheets/plugins/dynatree/ui.dynatree.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / color picker -->
        <link href='assets/stylesheets/plugins/bootstrap_colorpicker/bootstrap-colorpicker.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / datetime picker -->
        <link href='assets/stylesheets/plugins/bootstrap_datetimepicker/bootstrap-datetimepicker.min.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / daterange picker) -->
        <link href='assets/stylesheets/plugins/bootstrap_daterangepicker/bootstrap-daterangepicker.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / flags (country flags) -->
        <link href='assets/stylesheets/plugins/flags/flags.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / slider nav (address book) -->
        <link href='assets/stylesheets/plugins/slider_nav/slidernav.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / fuelux (wizard) -->
        <link href='assets/stylesheets/plugins/fuelux/wizard.css' media='all' rel='stylesheet' type='text/css' />
        <!-- / flatty theme -->
        <link href='assets/stylesheets/light-theme.css' id='color-settings-body-color' media='all' rel='stylesheet' type='text/css' />
        <!-- / demo -->
        <link href='assets/stylesheets/demo.css' media='all' rel='stylesheet' type='text/css' />
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>

        <style>
        #oneTable{width: 300px;height: auto;float: left;}
        #twoTable{width: 600px;height: auto;float: left;position: absolute;margin-left: 300px}
        #tab_container{width: auto;height: auto;position: relative}
        </style>

        <body class='contrast-red '>
        <header>
        <div class='navbar'>
        <div class='navbar-inner'>
        <div class='container-fluid'>
        <a class='brand' href='index.html'>
        <i class='icon-heart-empty'></i>
        <span class='hidden-phone'>Flatty</span>
        </a>
        <a class='toggle-nav btn pull-left' href='#'>
        <i class='icon-reorder'></i>
        </a>
        <ul class='nav pull-right'>
        <li class='dropdown light only-icon'>
        <a class='dropdown-toggle' data-toggle='dropdown' href='#'>
        <i class='icon-adjust'></i>
        </a>
        <ul class='dropdown-menu color-settings'>
        <li class='color-settings-body-color'>
        <div class='color-title'>Body color</div>
        <a data-change-to='assets/stylesheets/light-theme.css' href='#'>
        Light
        <small>(default)</small>
        </a>
        <a data-change-to='assets/stylesheets/dark-theme.css' href='#'>
        Dark
        </a>
        <a data-change-to='assets/stylesheets/dark-blue-theme.css' href='#'>
        Dark blue
        </a>
        </li>
        <li class='divider'></li>
        <li class='color-settings-contrast-color'>
        <div class='color-title'>Contrast color</div>
        <a href="#" data-change-to="contrast-red"><i class='icon-adjust text-red'></i>
        Red
        <small>(default)</small>
        </a>
        <a href="#" data-change-to="contrast-blue"><i class='icon-adjust text-blue'></i>
        Blue
        </a>
        <a href="#" data-change-to="contrast-orange"><i class='icon-adjust text-orange'></i>
        Orange
        </a>
        <a href="#" data-change-to="contrast-purple"><i class='icon-adjust text-purple'></i>
        Purple
        </a>
        <a href="#" data-change-to="contrast-green"><i class='icon-adjust text-green'></i>
        Green
        </a>
        <a href="#" data-change-to="contrast-muted"><i class='icon-adjust text-muted'></i>
        Muted
        </a>
        <a href="#" data-change-to="contrast-fb"><i class='icon-adjust text-fb'></i>
        Facebook
        </a>
        <a href="#" data-change-to="contrast-dark"><i class='icon-adjust text-dark'></i>
        Dark
        </a>
        <a href="#" data-change-to="contrast-pink"><i class='icon-adjust text-pink'></i>
        Pink
        </a>
        <a href="#" data-change-to="contrast-grass-green"><i class='icon-adjust text-grass-green'></i>
        Grass green
        </a>
        <a href="#" data-change-to="contrast-sea-blue"><i class='icon-adjust text-sea-blue'></i>
        Sea blue
        </a>
        <a href="#" data-change-to="contrast-banana"><i class='icon-adjust text-banana'></i>
        Banana
        </a>
        <a href="#" data-change-to="contrast-dark-orange"><i class='icon-adjust text-dark-orange'></i>
        Dark orange
        </a>
        <a href="#" data-change-to="contrast-brown"><i class='icon-adjust text-brown'></i>
        Brown
        </a>
        </li>
        </ul>
        </li>
        <li class='dropdown medium only-icon widget'>
        <a class='dropdown-toggle' data-toggle='dropdown' href='#'>
        <i class='icon-rss'></i>
        <div class='label'>5</div>
        </a>
        <ul class='dropdown-menu'>
        <li>
        <a href='#'>
        <div class='widget-body'>
        <div class='pull-left icon'>
        <i class='icon-user text-success'></i>
        </div>
        <div class='pull-left text'>
        John Doe signed up
        <small class='muted'>just now</small>
        </div>
        </div>
        </a>
        </li>
        <li class='divider'></li>
        <li>
        <a href='#'>
        <div class='widget-body'>
        <div class='pull-left icon'>
        <i class='icon-inbox text-error'></i>
        </div>
        <div class='pull-left text'>
        New Order #002
        <small class='muted'>3 minutes ago</small>
        </div>
        </div>
        </a>
        </li>
        <li class='divider'></li>
        <li>
        <a href='#'>
        <div class='widget-body'>
        <div class='pull-left icon'>
        <i class='icon-comment text-warning'></i>
        </div>
        <div class='pull-left text'>
        America Leannon commented Flatty with veeery long text.
        <small class='muted'>1 hour ago</small>
        </div>
        </div>
        </a>
        </li>
        <li class='divider'></li>
        <li>
        <a href='#'>
        <div class='widget-body'>
        <div class='pull-left icon'>
        <i class='icon-user text-success'></i>
        </div>
        <div class='pull-left text'>
        Jane Doe signed up
        <small class='muted'>last week</small>
        </div>
        </div>
        </a>
        </li>
        <li class='divider'></li>
        <li>
        <a href='#'>
        <div class='widget-body'>
        <div class='pull-left icon'>
        <i class='icon-inbox text-error'></i>
        </div>
        <div class='pull-left text'>
        New Order #001
        <small class='muted'>1 year ago</small>
        </div>
        </div>
        </a>
        </li>
        <li class='widget-footer'>
        <a href='#'>All notifications</a>
        </li>
        </ul>
        </li>
        <li class='dropdown dark user-menu'>
        <a class='dropdown-toggle' data-toggle='dropdown' href='#'>
        <img alt='Mila Kunis' height='23' src='assets/images/avatar.jpg' width='23' />
        <span class='user-name hidden-phone'>Mila Kunis</span>
        <b class='caret'></b>
        </a>
        <ul class='dropdown-menu'>
        <li>
        <a href='user_profile.html'>
        <i class='icon-user'></i>
        Profile
        </a>
        </li>
        <li>
        <a href='user_profile.html'>
        <i class='icon-cog'></i>
        Settings
        </a>
        </li>
        <li class='divider'></li>
        <li>
        <a href='LogoutServlet'>
        <i class='icon-signout'></i>
        Sign out
        </a>
        </li>
        </ul>
        </li>
        </ul>
        <form accept-charset="UTF-8" action="search_results.html" class="navbar-search pull-right hidden-phone" method="get" /><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
        <button class="btn btn-link icon-search" name="button" type="submit"></button>
        <input autocomplete="off" class="search-query span2" id="q_header" name="q" placeholder="Search..." type="text" value="" />
        </form>
        </div>
        </div>
        </div>
        </header>
        <div id='wrapper'>
        <div id='main-nav-bg'></div>
        <nav class='' id='main-nav'>
        <div class='navigation'>
        <div class='search'>
        <form accept-charset="UTF-8" action="search_results.html" method="get" /><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
        <div class='search-wrapper'>
        <input autocomplete="off" class="search-query" id="q" name="q" placeholder="Search..." type="text" value="" />
        <button class="btn btn-link icon-search" name="button" type="submit"></button>
        </div>
        </form>
        </div>
        <ul class='nav nav-stacked'>

        <li class=''>
        <a href='tables.html'>
        <span><a href="list.do" class="alert-link">用户管理</a></span>
        </a>
        </li>
        <li class=''>
        <a href='grid.html'>
        <span> <a href="list.Do" class="alert-link">角色管理</a></span>
        </a>
        </li>
        <li class=''>
        <a href='type.html'>
        <span>   <a href="list.mo" class="alert-link">权限列表</a></span>
        </a>
        </li>
        <li class=''>
        <a href='calendar.html'>
        <span><a href="user_list_menu.do" class="alert-link">查看用户权限</a></span>
        </a>
        </li>
        <li class=''>
        <a href='buttons_and_icons.html'>
        <span>   <a href="role_list_menu.Do" class="alert-link">查看角色权限</a></span>
        </a>
        </li>
            <li class=''>
            <a href='buttons_and_icons.html'>
            <span>   <a href="user_list_role.do" class="alert-link">用户角色权限</a></span>
            </a>
            </li>

        </ul>
        </div>
        </nav>
        <section id='content'>
        <div class='container-fluid'>
        <div class='row-fluid' id='content-wrapper'>
        <div class='span12'>

        <div class='row-fluid' >
        <div class='span12 box bordered-box red-border' style='margin-bottom:0;'>
        <div class='box-header purple-background'>
        <div class='title'>用户拥有角色权限功能菜单</div>
        <div class='actions'>
        <a href="#" class="btn box-remove btn-mini btn-link"><i class='icon-remove'></i>
        </a>
        <a href="#" class="btn box-collapse btn-mini btn-link"><i></i>
        </a>
        </div>
        </div>
        <div class='box-content box-no-padding'>
        <div class='responsive-table' id="tab_container">
        <div class='scrollable-area'>

        <table class='table table-hover table-striped' id="oneTable" style='margin-bottom:0;'>
        <thead>
        <tr>
        <th>
        用户工号
        </th>
        <th>
        用户名称
        </th>
            <th>
            用户分配
            </th>
        </tr>
        </thead>
        <tbody>
        <tr>
        <c:forEach items="${user_role}" var="u">
            <tr>
            <td>${u.userid}</td>
            <td>${u.username}</td>
                <td>${u.fullname}</td>
            </tr>
        </c:forEach>
        </tr>
        </tbody>
        </table>

        <table class='table table-hover table-striped' id="twoTable" style='margin-bottom:0;'>
        <thead>
        <tr>
        <th>
        角色编号
        </th>
        <th>
        角色名称
        </th>
        </tr>
        </thead>
        <tbody>
        <tr>
        <c:forEach items="${roleSet}" var="r">
            <tr>
            <td>${r.roleid}</td>
            <td>${r.rolename}</td>
            </tr>
        </c:forEach>
        </tr>
        </tbody>
        </table>

        </div>
        </div>
        </div>
        </div>
        </div>

        </div>
        </div>
        </div>
        </section>
        </div>
        <!-- / jquery -->
        <script src='assets/javascripts/jquery/jquery.min.js' type='text/javascript'></script>
        <!-- / jquery mobile events (for touch and slide) -->
        <script src='assets/javascripts/plugins/mobile_events/jquery.mobile-events.min.js' type='text/javascript'></script>
        <!-- / jquery migrate (for compatibility with new jquery) -->
        <script src='assets/javascripts/jquery/jquery-migrate.min.js' type='text/javascript'></script>
        <!-- / jquery ui -->
        <script src='assets/javascripts/jquery_ui/jquery-ui.min.js' type='text/javascript'></script>
        <!-- / bootstrap -->
        <script src='assets/javascripts/bootstrap/bootstrap.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/flot/excanvas.js' type='text/javascript'></script>
        <!-- / sparklines -->
        <script src='assets/javascripts/plugins/sparklines/jquery.sparkline.min.js' type='text/javascript'></script>
        <!-- / flot charts -->
        <script src='assets/javascripts/plugins/flot/flot.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/flot/flot.resize.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/flot/flot.pie.js' type='text/javascript'></script>
        <!-- / bootstrap switch -->
        <script src='assets/javascripts/plugins/bootstrap_switch/bootstrapSwitch.min.js' type='text/javascript'></script>
        <!-- / fullcalendar -->
        <script src='assets/javascripts/plugins/fullcalendar/fullcalendar.min.js' type='text/javascript'></script>
        <!-- / datatables -->
        <script src='assets/javascripts/plugins/datatables/jquery.dataTables.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/datatables/jquery.dataTables.columnFilter.js' type='text/javascript'></script>
        <!-- / wysihtml5 -->
        <script src='assets/javascripts/plugins/common/wysihtml5.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/common/bootstrap-wysihtml5.js' type='text/javascript'></script>
        <!-- / select2 -->
        <script src='assets/javascripts/plugins/select2/select2.js' type='text/javascript'></script>
        <!-- / color picker -->
        <script src='assets/javascripts/plugins/bootstrap_colorpicker/bootstrap-colorpicker.min.js' type='text/javascript'></script>
        <!-- / mention -->
        <script src='assets/javascripts/plugins/mention/mention.min.js' type='text/javascript'></script>
        <!-- / input mask -->
        <script src='assets/javascripts/plugins/input_mask/bootstrap-inputmask.min.js' type='text/javascript'></script>
        <!-- / fileinput -->
        <script src='assets/javascripts/plugins/fileinput/bootstrap-fileinput.js' type='text/javascript'></script>
        <!-- / modernizr -->
        <script src='assets/javascripts/plugins/modernizr/modernizr.min.js' type='text/javascript'></script>
        <!-- / retina -->
        <script src='assets/javascripts/plugins/retina/retina.js' type='text/javascript'></script>
        <!-- / fileupload -->
        <script src='assets/javascripts/plugins/fileupload/tmpl.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/load-image.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/canvas-to-blob.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/jquery.iframe-transport.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/jquery.fileupload.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/jquery.fileupload-fp.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/jquery.fileupload-ui.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/fileupload/jquery.fileupload-init.js' type='text/javascript'></script>
        <!-- / timeago -->
        <script src='assets/javascripts/plugins/timeago/jquery.timeago.js' type='text/javascript'></script>
        <!-- / slimscroll -->
        <script src='assets/javascripts/plugins/slimscroll/jquery.slimscroll.min.js' type='text/javascript'></script>
        <!-- / autosize (for textareas) -->
        <script src='assets/javascripts/plugins/autosize/jquery.autosize-min.js' type='text/javascript'></script>
        <!-- / charCount -->
        <script src='assets/javascripts/plugins/charCount/charCount.js' type='text/javascript'></script>
        <!-- / validate -->
        <script src='assets/javascripts/plugins/validate/jquery.validate.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/validate/additional-methods.js' type='text/javascript'></script>
        <!-- / naked password -->
        <script src='assets/javascripts/plugins/naked_password/naked_password-0.2.4.min.js' type='text/javascript'></script>
        <!-- / nestable -->
        <script src='assets/javascripts/plugins/nestable/jquery.nestable.js' type='text/javascript'></script>
        <!-- / tabdrop -->
        <script src='assets/javascripts/plugins/tabdrop/bootstrap-tabdrop.js' type='text/javascript'></script>
        <!-- / jgrowl -->
        <script src='assets/javascripts/plugins/jgrowl/jquery.jgrowl.min.js' type='text/javascript'></script>
        <!-- / bootbox -->
        <script src='assets/javascripts/plugins/bootbox/bootbox.min.js' type='text/javascript'></script>
        <!-- / inplace editing -->
        <script src='assets/javascripts/plugins/xeditable/bootstrap-editable.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/xeditable/wysihtml5.js' type='text/javascript'></script>
        <!-- / ckeditor -->
        <script src='assets/javascripts/plugins/ckeditor/ckeditor.js' type='text/javascript'></script>
        <!-- / filetrees -->
        <script src='assets/javascripts/plugins/dynatree/jquery.dynatree.min.js' type='text/javascript'></script>
        <!-- / datetime picker -->
        <script src='assets/javascripts/plugins/bootstrap_datetimepicker/bootstrap-datetimepicker.js' type='text/javascript'></script>
        <!-- / daterange picker -->
        <script src='assets/javascripts/plugins/bootstrap_daterangepicker/moment.min.js' type='text/javascript'></script>
        <script src='assets/javascripts/plugins/bootstrap_daterangepicker/bootstrap-daterangepicker.js' type='text/javascript'></script>
        <!-- / max length -->
        <script src='assets/javascripts/plugins/bootstrap_maxlength/bootstrap-maxlength.min.js' type='text/javascript'></script>
        <!-- / dropdown hover -->
        <script src='assets/javascripts/plugins/bootstrap_hover_dropdown/twitter-bootstrap-hover-dropdown.min.js' type='text/javascript'></script>
        <!-- / slider nav (address book) -->
        <script src='assets/javascripts/plugins/slider_nav/slidernav-min.js' type='text/javascript'></script>
        <!-- / fuelux -->
        <script src='assets/javascripts/plugins/fuelux/wizard.js' type='text/javascript'></script>
        <!-- / flatty theme -->
        <script src='assets/javascripts/nav.js' type='text/javascript'></script>
        <script src='assets/javascripts/tables.js' type='text/javascript'></script>
        <script src='assets/javascripts/theme.js' type='text/javascript'></script>
        <!-- / demo -->
        <script src='assets/javascripts/demo/jquery.mockjax.js' type='text/javascript'></script>
        <script src='assets/javascripts/demo/inplace_editing.js' type='text/javascript'></script>
        <script src='assets/javascripts/demo/charts.js' type='text/javascript'></script>
        <script src='assets/javascripts/demo/demo.js' type='text/javascript'></script>

        </body>
        </html>
